<script setup lang="ts">

</script>


<template>
  <el-container>
    <el-aside width="240px">
      <Menu></Menu>
    </el-aside>
    <el-container>
      <el-header
      id="header"
      class="header"
      >
        <breadcrumb></breadcrumb>
      </el-header>

      <el-scrollbar
        :height="`calc(100vh - ${headerHeight}px)`"
      >
        <el-main>
          <iframe
              class="custom-scrollbar"
            :src="useManageRouterStore().$state.nowMenu.path"
            frameborder="0"
            style="width: 100%;"
          :style="{
              height:`calc(100vh - ${headerHeight}px - 30px)`
          }"
          >
          </iframe>

        </el-main>
      </el-scrollbar>
    </el-container>
  </el-container>

</template>

<style scoped>
.header{
  height: 80px;
}
.custom-scrollbar::-webkit-scrollbar {
  width: 8px;  /* 设置滚动条的宽度 */
}
.custom-scrollbar::-webkit-scrollbar-track {
  background-color: #f1f1f1;  /* 设置滚动条轨道的背景颜色 */
}
.custom-scrollbar::-webkit-scrollbar-thumb {
  background-color: #888;  /* 设置滚动条的颜色 */
}
.custom-scrollbar::-webkit-scrollbar-thumb:hover {
  background-color: #555;  /* 设置鼠标悬停时滚动条的颜色 */
}


</style>